<template>
  <div class="col main-content mt-15">
    <el-table
      ref="table"
      :data="datas"
      border
      stripe
      tooltip-effect="dark"
      style="width: 100%">
      <el-table-column
        type="index"
        width="48" align="center">
      </el-table-column>
      <el-table-column label="模版编码" prop="code"></el-table-column>
      <el-table-column label="模版名称" prop="name"></el-table-column>
      <el-table-column label="说明" prop="note">
      </el-table-column>
      <el-table-column label="是否启用" width="120" align="center">
        <template slot-scope="scope">
          <el-tooltip placement="top">
            <div slot="content">当不启用的时候不会像用户发送该类邮件</div>
            <el-switch
              v-model="scope.row.activated"
              active-text="是"
              inactive-color="#ff4949"
              inactive-text="否" @change="activatedChange(scope.row,$event)">
            </el-switch>
          </el-tooltip>
        </template>
      </el-table-column>
      <el-table-column label="操作" width="60" align="center">
        <template slot-scope="scope">
          <el-tooltip placement="top">
            <div slot="content">编辑邮件的内容和格式</div>
            <el-button type="text" @click="edit(scope.$index,scope.row)">编辑</el-button>
          </el-tooltip>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<style>

</style>
<script>
  import AdminService from 'src/service/admin'

  export default {
    name: 'AdminMailTemplate',
    data() {
      return {
        datas: []
      }
    },
    methods: {
      activatedChange: function (data, v) {
        const me = this
        AdminService.saveMailTemplate({
          id: data.id,
          activated: v
        }).then(ds => {
          if (ds != null) {
            me.$message.success('保存状态成功。')
          }
        })
      },
      getDatas: function () {
        const me = this
        AdminService.mailTemplates().then(function (data) {
          if (data.code == 0 && data.datas != null) {
            me.datas = data.datas
          }
        })
      },
      edit: function (index, data) {
        this.$router.push('/admin/system/mailtemplate/' + data.id + '/edit.html')
      }
    },
    beforeMount: function () {
      this.getDatas()
    }
  }
</script>
